#pos-vendas {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 100vw;
}

.container-home-3 {
    background-size: cover;
    background-repeat: no-repeat;
    background-image:url('../imagens para/Sem nome (2641 x 2000 px) (1170 x 524 px) (1).gif');
   }
   
   .container-home-4 {
     width:95%;
     margin:auto;
     padding-block:30px;
     height:auto;
     display:flex;
     flex-direction:column;
     gap:4rem;
   }

   .position-para {
    width: 90%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    align-self: center;
   }
   
   .animated-text h1 {
    width: 9rem;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
   }

.text-pos {
    font-family: "Montserrat", sans-serif;
    width: 80%;
    color: black;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.text-pos p {
    margin-top: 30px;
    font-size: .3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.text-pos h6 {
    font-weight: normal;
    font-size: .3rem;
    margin-top: 50px;
    margin-bottom: 2rem;
}

.color-container {
    width: 90%;
    height: auto;
    padding: 50px 50px 0 50px;
    background-image: url('/pos-images/sp\ ponte.jpg');
    box-shadow: rgba(50, 50, 93, 0.342) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.349) 0px 18px 36px -18px inset;
    border-radius: 15px;
    background-size: cover;
    background-attachment: fixed;
    margin-bottom: 200px;

}

.pos-vendas,
.pos-vendas-2 {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 50px;
    width: 100%;
}

.direção,
.direção-2 {
    display: flex;
    justify-content: space-between;
}


#galery-1 {
    background: url('/pos-images/reembolso.jpg') no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 630px;
    margin-bottom: 100px;
    background-position: -300;
    width: 100%;
    max-width: 300px;
    margin-right: 50px;
}

.galery-1 {
    width: 300px;
    border: 1px solid #80808000;
    margin-bottom: 100px;
}

.description {
    font-size: 20px;
    width: 90%;
    height: 2rem;
    margin-top: 350px;
    margin-left: 60px;
    padding: 5px;
    background-color: rgba(155, 203, 223, 0.692);
    color: rgb(0, 0, 56);
    border-radius: 10px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
    position: relative;
    z-index: 900;
}


.bl {
    width: 10rem;
    margin-bottom: 100rem;
}

.galery-2 {
    width: 300px;
    border: 1px solid #80808000;
    margin-bottom: 100px;
}

#galery-2 {
    background: url('/pos-images/boletos.avif') center no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 730px;
    background-position: -350px;
    width: 100%;
    margin-right: 50px;
    max-width: 300px;
}

.galery-3 {
    width: 300px;
    border: 1px solid #80808000;
    margin: auto;
    margin-bottom: 100px;
}

#galery-3 {
    margin-bottom: 100px;
    background: url('/pos-images/envio.webp') center no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 800px;
    width: 100%;
    max-width: 300px;
    margin-right: 50px;
    background-position: -200px;
}

.galery-4 {
    width: 300px;
    border: 1px solid #80808000;
    margin: auto;
    margin-bottom: 100px;
}

#galery-4 {
    background: url('/pos-images/diretoria.webp') center no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 600px;
    background-position: -150px;
    width: 100%;
    max-width: 300px;
}



.galery-5 {
    width: 300px;
    border: 1px solid #fd000000;
    margin-bottom: 100px;
}

#galery-5 {
    background: url('/pos-images/auxilio.avif') no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 630px;
    margin-bottom: 100px;
    background-position: -320px;
    width: 100%;
    max-width: 300px;
    margin-right: 50px;
    position: relative;

}

.galery-6 {
    width: 300px;
    border: 1px solid #80808000;
    margin-bottom: 100px;
}

#galery-6 {
    background: url('/pos-images/apolice.jpeg') center no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 730px;
    background-position: -200px;
    width: 100%;
    max-width: 300px;
    margin-right: 50px;

}

.galery-7 {
    width: 300px;
    border: 1px solid #80808000;
    margin: auto;
    margin-bottom: 100px;
}

#galery-7 {
    margin-bottom: 100px;
    background: url('/pos-images/acompoanhamento.png') center no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 700px;
    width: 100vw;
    max-width: 300px;
    margin-right: 50px;

}

.galery-8 {
    width: 300px;
    border: 1px solid #80808000;
    margin: auto;
    margin-bottom: 100px;
}

#galery-8 {
    background: url('/pos-images/guias.jpg') center no-repeat;
    height: 400px;
    border-radius: 1rem;
    box-shadow: rgba(0, 0, 0, 0.45) 0px 25px 20px -20px;
    background-size: 600px;
    background-position: -200px;
    width: 100%;
    max-width: 300px;
}




@media screen and (max-width: 1024px) {

    #pos-vendas {
        width: 100vw;
        margin-top: 250px;
    }

    .color-container {
        width: 90%;
        padding: 50px 50px 0 50px;
        background-image: url('/pos-images/sp\ ponte\(2\).jpg');
        box-shadow: rgba(50, 50, 93, 0.342) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.349) 0px 18px 36px -18px inset;
        border-radius: 15px;
        margin-bottom: 100px;
        background-attachment: fixed;
    }

    .pos-vendas {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .direção,
    .direção-2 {
        display: flex;
        flex-direction: column;
    }
    #galery-1,
    .galery-2,
    .galery-3,
    .galery-4,
    .galery-5,
    .galery-6,
    .galery-7,
    .galery-8 {
        margin-left: 35px;
    }

}


@media only screen and (max-width: 480px) {
    .color-container {
        all: unset;
        width: 90%;
        padding: 50px 50px 0 50px;
        background-color: rgb(30, 93, 230);
        box-shadow: rgba(50, 50, 93, 0.342) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.349) 0px 18px 36px -18px inset;
        border-radius: 15px;
        margin-bottom: 100px;
    }
}